import 'package:flutter/material.dart';

class SwitchAndCheckBoxPage extends StatefulWidget {
  @override
  _SwitchAndCheckBoxPageState createState() =>
      new _SwitchAndCheckBoxPageState();
}

class _SwitchAndCheckBoxPageState
    extends State<SwitchAndCheckBoxPage> {
  bool _switchSelected = true; //维护单选开关状态
  bool _checkbox1Selected = true; //维护复选框状态
  bool _checkbox2Selected = false; //维护复选框状态
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: DefaultTextStyle(
            textAlign: TextAlign.start,
            style: TextStyle(
              fontSize: 20,
              color: Colors.black,
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Text(
                    'Switch:单选开关\n  value:控制开关状态\n  onChange(value){}:方法监听状态改变 \n  activeColor:设置打开颜色'),
                Switch(
                  activeColor: Colors.green,
                  value: _switchSelected, //当前状态
                  onChanged: (value) {
                    //重新构建页面
                    setState(() {
                      _switchSelected = value;
                    });
                  },
                ),
                Text(
                    'Checkbox:复选开关\n  value:控制开关状态\n  onChange(value){}:监听状态改变\n  activeColor:设置选中颜色'),
                Checkbox(
                  value: _checkbox1Selected,
                  activeColor: Colors.blue, //选中时的颜色
                  onChanged: (value) {
                    setState(() {
                      _checkbox1Selected = value;
                    });
                  },
                ),
                Checkbox(
                  value: _checkbox2Selected,
                  activeColor: Colors.red, //选中时的颜色
                  onChanged: (value) {
                    setState(() {
                      _checkbox2Selected = value;
                    });
                  },
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}
